<template>
    <div>
        <Form ref="form" :model="help_document" :rules="rules" :label-width="100">
            <FormItem label="信息标题" prop="title">
                <Input v-model="help_document.title" placeholder="请输入要发布文章的标题"></Input>
            </FormItem>
            <FormItem label="文档类别" prop="hd_type">
                <Select v-model="help_document.hd_type" style="width:200px;z-index:9999;position:absolute;">
                    <Option v-for="item in chosen_type" :value="item.name" :key="item.name">{{ item.name }}</Option>
                </Select>
            </FormItem>
            <FormItem label="文档内容">
                <UE ref="ue" v-model="help_document.content"></UE>
            </FormItem>
            <FormItem>
                <Button type="primary" @click="handleAdd">{{ help_document.id ? "修改" : "发布" }}帮助文档</Button>
            </FormItem>
        </Form>
    </div>
</template>
<script>
import HelpDocument from "@/common/model/HelpDocument"
import UE from '@/common/components/UE'

export default {
    name: "HelpPost",
    props: {
        value: {
            type: Number,
            default: 0
        }
    },
    data () {
        return {
            help_document: new HelpDocument(),
            rules: {
                title: [
                    { required:true, message: '标题不能为空', trigger: 'blur' }
                ],
                hd_type: [
                    { required: true, message: '文档类别不能为空', trigger: 'change' }
                ]
            },
        }
    },
    computed:{
        chosen_type () {
            return this.$store.state.app.dicTree.help.children;
        }
    },
    components: {
        UE
    },
    methods:{
        handleAdd(){
            this.$refs["form"].validate((valid) => {
                if (!valid) return;
                this.help_document.content = this.$refs.ue.getUEContent();
                var url = this.help_document.id ? "help/modify" : "help/add";
                var message = this.help_document.id ? "文档修改成功!" : "文档发布成功!";
                var emit = this.article.id ? "on-modify" : "on-add";
                this.api.post(url, this.help_document.serialize(), res => {
                    this.$CustomMessage.success(message);
                    this.$emit(emit, this.help_document);
                });
            });
        },
        init() {
            this.article = new HelpDocument();
            if(this.value){
                this.api.post("help/get",{id: this.value},res=>{
                    this.help_document.parse(res.data);
                })
            }
        }
    },
    created(){
        this.init();
    },
    watch: {
        value() {
            this.init();
        }
    }
};
</script>